<template>
  <div class="app-container">

    <h3>订单列表</h3>

    <!--    查询条件  -->
    <el-form :inline="true" class="demo-form-inline">

      <el-form-item>
        <el-input v-model="order.orderNo" placeholder="订单号"/>
      </el-form-item>

      <el-button type="primary" icon="el-icon-search" @click="getList()">查 询</el-button>

      <el-button type="default" @click="resetData()">清空</el-button>

    </el-form>
    <!-- 表格 -->
    <el-table
      :data="list"
      border
      fit
      highlight-current-row>

      <el-table-column
        label="序号"
        width="70"
        align="center">
        <template slot-scope="scope">
          {{ (current - 1) * limit + scope.$index + 1 }}
        </template>
      </el-table-column>



      <el-table-column prop="orderNo" label="订单号"/>
      <el-table-column prop="planeId" label="航班号"/>

      <el-table-column prop="startCity" label="出发城市"/>

      <el-table-column prop="endCity" label="到达城市"/>
      <el-table-column prop="flightStartTime" label="起飞时间"/>
      <el-table-column prop="flightEndTime" label="降落时间"/>
      <el-table-column prop="seating" label="座位号"/>
      <el-table-column prop="userId" label="用户id"/>
      <el-table-column prop="name" label="用户姓名"/>
      <el-table-column prop="phone" label="用户手机号"/>
      <el-table-column prop="phone" label="用户手机号"/>
      <el-table-column prop="totalFee" label="订单金额"/>
      <el-table-column prop="payType" label="支付类型"/>
      <el-table-column prop="status" label="订单状态"/>

      <el-table-column prop="gmtCreate" label="创建时间" width="90"/>

      <el-table-column prop="gmtModified" label="修改时间" width="90"/>

    </el-table>

    <!-- 分页 -->
    <el-pagination
      :current-page="current"
      :page-size="limit"
      :total="total"

      style="padding: 30px 0; text-align: center;"
      layout="total, prev, pager, next, jumper"
      @current-change="getList"
    />
  </div>

</template>
<script>
import orderInfo from '../../../api/pc/order/orderList'

export default {

  name: 'list',
  data() {
    // 定义变量和初始值
    return {
      list: null, // 查询之后接口返回集合
      current: 1, // 当前页
      limit: 6, // 每页显示数
      total: 0, // 总记录数
      order: {} // 条件封装对象
    }
  },
  created() {
    this.getFirstList()
  },


  methods: {
    getFirstList(page =1){
      this.page =page
      orderInfo.getFirstOrder(this.page,this.limit)
        .then(response => {
          this.list = response.data.rows
          this.total = response.data.total
        })
    },

    //进入页面打开 查询出所有航班
    getList(page = 1) {
      this.page = page
      orderInfo.orderPage(this.current, this.limit, this.order)
        .then(response => {
          this.list = response.data.list
          this.total = response.data.total
        })

    },

    resetData() {
      this.planeQuery = {}
      this.getFirstList()
    }

  }
}
</script>


<style scoped>

</style>
